<template>
	<view class="">
		<view class="bg_FFFFFF u-p-30 u-flex u-row-between">
			<view class="">
				<text>邀请数量:</text>
				<text style="color: #FB5022;">{{count}}</text>
			</view>
			<view class="">
				<text>累计奖励:</text>
				<text style="color: #FB5022;">￥{{all_reward}}抵扣金</text>
			</view>
		</view>
		<view class="u-p-20">
			<view class="">
				<u-notice-bar mode="vertical" bg-color="#FB5022" color="#FFF" border-radius="10" :list="noticeList"></u-notice-bar>
			</view>
			<view class="u-m-t-20 bg_FFFFFF  u-b-r-16 ">
				<view class="u-p-20 u-flex " v-for="(item,index) in list" :key="index" style="border-bottom: 1rpx solid #EAEAEA;">
					<view class="">
						
					</view>
					<view class="">
						<u-image :src='item.avatar' shape="circle" width='100rpx' height='100rpx'></u-image>
					</view>
					<view class="u-flex u-row-between u-col-top u-w-600 u-m-l-20">
						<view class="">
							<view class="u-flex u-col-top u-w-350">
								<view class=" u-font-26 u-w-120" style="color: #FF3846;">{{item.identity_name}}</view>
								<view class="u-font-28 u-w-220 u-weight">{{item.name}}</view>
							</view>
							<view class="u-m-t-20 u-font-28">{{item.mobile}}</view>
							<view class="u-m-t-20 u-font-28">下级人数：{{item.team_count}}</view>
						</view>
						<view class="">
							<view class="u-font-20" style="color: #898989;">{{item.create_time}}注册</view>
							<!-- <view class="u-m-t-30" style="text-align: right;" @click="detail(item)">
								<text style="color: #FC3533;">¥{{item.deduct}}</text>
								<u-icon name='arrow-right'></u-icon>
							</view> -->
						</view>
					</view>
				</view>
			
			</view>
			<!-- 加载更多 -->
			<u-loadmore :status="status" icon-type="circle" margin-top="20" margin-bottom="20" />
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				all_reward:0,
				count:0,
				// 滚动通知
				noticeList:[],
				params:{
					page:1,
					page_size:20
				},
				list:[],
				status: 'loadmore',
			}
		},
		onLoad() {
			this.clear()
			this.invite_profit()
		},
		// 下拉到底事件
		onReachBottom() {
			//避免多次触发
			if (this.status == 'loading' || this.status == 'nomore') {
				return;
			}
			this.invite_profit();
		},
		methods: {
			clear() {
				this.list = [];
				this.params.page = 1;
			},
			invite_profit(){
				this.$api.invite_profit(this.params,res=>{
					if(res.data.code==1){
						this.all_reward=res.data.data.all_reward
						this.count=res.data.data.friends.total
						this.noticeList=[]
						if(res.data.data.order_list.length>0){
							res.data.data.order_list.forEach(o=>{
								this.noticeList.push(`${o.des} ${o.create_time}`)
							})
						}
						if (res.data.data.friends.data.length < 20) {
							this.status = 'nomore';
						} else {
							this.params.page = this.params.page + 1;
							this.status = 'loadmore';
						}
						this.list = this.list.concat(res.data.data.friends.data);
						uni.stopPullDownRefresh();
					}
				})
			},
			detail(item){
				uni.setStorageSync('invitaInfo',item)
				this.$u.route(`/subcontract/invitation/massage/massage?id=${item.id}`)
			}
		}
	}
</script>

<style scoped>
	page {
		background-color: #f5f5f5;
	}
</style>
